@mixin focus($color, $isInset: false) {
  outline: none;
  @if $isInset {
    box-shadow: inset 0 0 0 2px rgba(red($color), green($color), blue($color), .5);
  } @else {
    box-shadow: 0 0 0 2px rgba(red($color), green($color), blue($color), .5);
  }
}

@function str-replace($string, $search, $replace: '') {
  $index: str-index($string, $search);

  @if $index {
    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
  }

  @return $string;
}

@mixin clearfix {
  &:before, &:after {
    content: "";
    display: table;
  }
  &:after {
    clear: both;
  }
}
@mixin input-focus($color) {
  border-color: $color;
  @include focus($color);
  z-index: 1;
}

@mixin input-style($border-color, $border-focus-color) {
  border: 1px solid $border-color;
  &:focus, &.ui-focus {
    @include input-focus($border-focus-color);
  }
  &[readonly] {
    cursor: pointer;
  }
  &[disabled], &.ui-disabled {
    background-color: $color-light;
  }
}

@mixin input-size($v, $h, $radius, $font-size) {
  padding: $v $h;
  line-height: $line-height;
  font-size: $font-size;
  border-radius: $radius;
  &.ui-disabled, &[disabled] {
    opacity: .5;
    cursor: not-allowed;
  }
}

@mixin input-addon-style($border-color, $border-focus-color) {
  border: 1px solid $border-color;
  text-align: center;
  min-width: 34px;
}
